<script setup>
import { ref } from 'vue'
import { NFlex, NList, NListItem, NInputNumber, NInput, NSelect } from 'naive-ui'
import Profile from '../store/Profile';
const profile = Profile()
const name = 'mental calculation'
</script>

<template>
  <n-list style="width: 100%" :show-divider="true">
    <n-list-item>
      <n-input-number block style="width: 100%" v-model:value="profile.data[name].count" placeholder="输入算式数量" :show-button="false">
        <template #prefix>
          <div>数量 :</div>
        </template>
      </n-input-number>
    </n-list-item>
    <n-list-item>
      <n-input-number block style="width: 100%" v-model:value="profile.data[name].col" placeholder="输入列数" :show-button="false">
        <template #prefix>
          <div>列数 :</div>
        </template>
      </n-input-number>
    </n-list-item>
    <n-list-item>
      <n-input-number block style="width: 100%" v-model:value="profile.data[name].level" placeholder="输入列数" :show-button="false">
        <template #prefix>
          <div>运算级别 :</div>
        </template>
      </n-input-number>
    </n-list-item>
    <n-list-item>
      <n-input block style="width: 100%" v-model:value="profile.data[name].title" placeholder="输入标题" :show-button="false">
        <template #prefix>
          <div>标题 :</div>
        </template>
      </n-input>
    </n-list-item>
  </n-list>
</template>

<style>
/*@import '/src/style.css'*/
</style>
